나는 매년 실행되는 이벤트를 예약 할 수있는 사이트를 개편하고 있습니다. 각 이벤트에는 현재 완전히 정적 인 자체 페이지가 있습니다. 각 페이지는 제목, 설명 및 장소별로 정렬 된 날짜 목록으로 구성됩니다. 매년 새로운 날짜를 사용할 수있게되면 누군가가 들어가서 각각의 HTML을 수동으로 변경해야합니다. 이는 분명히 힘든 일입니다.정적 인 페이지에 간단한 동적 요소를 추가하려면 어떻게해야합니까?
날짜를 저장하는 CSV 파일 (단편적으로 추가 될 수 있음)을 가지고 프로세스를 자동화하고 페이지가로드 될 때 관련 날짜를 페이지에서 가져오고 싶습니다. 서버 측에 대한 경험이 없지만 jQuery에 대한 지식이 약간 있습니다. AJAX 등으로이 작업을 수행 할 수 있어야한다고 생각합니다.
가장 쉬운 방법은 PHP와 mySQL 데이터베이스를 사용하는 것입니다. CSV 파일을 사용하여 데이터베이스를 추가하거나 덮어 쓸 수는 있지만 장기적으로는 수동으로 mysql 데이터베이스를 덮어 쓰거나 업데이트하는 작업을 거치지 않고 간단한 입력 양식을 개발하여 데이터베이스를 업데이트하는 것이 좋습니다. CSV 파일.
Ajax는 클라이언트 측 스크립트와 서버 측 스크립트 간의 대화를 활용하는 기술입니다. 그래서 그것을 사용하기 위해서 당신은 약간의 서버 측 내용을 연구해야 할 것입니다. JQuery는 브라우저에서 클라이언트 시스템에서만 실행된다는 것을 의미하는 클라이언트 측 스크립트입니다.
PHP로 시작하는 것이 좋습니다. 배우고 사용하는 것이 더 간단합니다. 그리고 파일을 읽는 것만으로도 원하는대로 쉽게 배울 수 있습니다.
그런 간단한 일을하기 위해 PHP를 배울 필요가 없습니다. jQuery를 조금이라도 알고 있다면 간단히 JSON 파일을 서버에 추가하면됩니다. 이 구조 events.json는 (. 예 underscore) jquery.get와
[
{
"event": "Event name",
"description": "description of the event",
"dates": [
{
"date": "20131028",
"place": "Dublin"
}, {
"date": "20131030",
"place": "London"
}
]
}, {
... another event here with the same structure...
}
]
부하를 일부 템플릿 라이브러리를 사용하고 이벤트와 세부 사항을 표시하는 페이지 내에서 간단한 템플릿을합니다. 마지막으로 이벤트 목록을 표시하는 데는 2 페이지 (또는 어쩌면 하나만), home.html, 이벤트에 대한 세부 정보를 표시하려면 event.html이 표시됩니다.
이제 events.json을 편집하면 홈 페이지 및 세부 정보 페이지에 이벤트가 추가되고 변경됩니다. 이것은 단지 대략적인 예일 뿐이며 요구 사항에 따라 사용자 정의해야합니다.
나는 귀하의 경우에 최고의 아이 솔즈의 아이디어라고 생각합니다. 데이터베이스와 PHP를 얻으려면 데이터베이스 자체에 데이터를 저장하는 방법이 필요합니다. 이렇게하면 완전히 새로운 웜을 열 수 있습니다. 물론 데이터베이스 + 서버 측 프론트 엔드는 업계 표준이지만 사용자 요구 사항에 비해 크기가 큽니다.
간단한 텍스트 파일에서 JSON을 읽을 때 JSON을 표시하는 방법을 배우는 것이 더 쉽습니다. 이 코드는 한 번만 작성하면됩니다.
변경 사항이있을 때마다 간단한 워크 플로를 사용할 수 있습니다. Excel을 사용하여 미리 녹음 된 형식을 사용하여 이벤트를 입력합니다. 그런 다음 Excel 파일을 .csv로 내 보냅니다. 작은 프로그램을 사용하여 CSV를 읽고이를 JSON에 직렬화하십시오. 출력을 서버의 미리 지정된 위치로 복사하십시오. 다 준비 됐어.
누군가가 부재중에 사이트를 업데이트해야한다면 Excel, 변환 도구 (작은 크기) 및 서버 암호 만 있으면됩니다. 이 대답의 끝에서 변환 도구의 코드를 게시하고 있습니다.
또는 코드를 사용하여 ASP .NET WebForms 프로젝트를 만들 수 있습니다. 코드에 의해 생성 된 객체를 직렬화하는 대신에를 만들 수 있습니다.aspx 페이지 및 서버 측 코드를 사용하여 데이터를 표시합니다. 그러나 이것은 몇 가지 단점이 있습니다.
는 JSON에 CSV로 변환하는 C#을 appliaction에 대한 코드입니다. 컴파일되면 DataSource.csv라는 CSV와 동일한 디렉토리에 .exe 파일을 저장하십시오. 더블 클릭하십시오. 동일한 디렉토리에 autoOutput.json이라는 새 파일이 생성됩니다. .csv 파일의 각 행은 event name; venue; date; cost; 형식으로 작성되어야합니다. 당신은 cost의 오른쪽에있는 Excel에서 주석 또는 유사 항목을 추가 할 수 있습니다, 그들은 삭제됩니다. 줄의 순서는 중요하지 않습니다. 이벤트 이름이 고유 한 경우 시작되는 모든 장소와 날짜는 해당 이벤트에 속한 것으로 해석됩니다. 이벤트 이름과 장소의 조합이 고유 한 경우 모든 날짜는 해당 장소의 해당 이벤트에 대한 것으로 해석됩니다.
너무 짧아서 어떤 행을 읽을 수 없었는지에 대한 정보는 제공하지 않습니다. 파일에 추가하거나 내용을 경고와 교환 할 수 있습니다. 그런 다음 변환을 수행하는 사람은 경고가 없거나 파일에 남겨 둘 수있을 때까지 CSV를 조작해야하지만 표시를 위해로드 할 때는 무시하십시오.
이 특히 크롬과 IE의 보안 문제를 던질 것으로 보인다using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using System.IO;
using System.Web.Script.Serialization;
namespace ElendilEvents2JSON
{
public class Event
{
public String Name { get; set; }
public List<EventInVenue> venues { get; set; }
}
public class EventInVenue
{
public String VenueName { get; set; }
public List<EventInstance> Dates { get; set; }
}
public class EventInstance
{
public String When { get; set; }
public String Cost { get; set; }
}
class Program
{
static void Main(String[] args)
{
//read the file
List<int> unreadable;
List<Event> events = readFile(@".\SourceData.csv", out unreadable);
//write the file using the normal JSON serializer. Will output just everything as a single line. If the data structure is changed, it will output in the new structure.
string autoOutput;
JavaScriptSerializer serializer = new JavaScriptSerializer();
autoOutput = serializer.Serialize(events);
File.WriteAllText(@".\autoOutput.json", autoOutput);
}
public static List<Event> readFile(string path, out List<int> unreadableLines)
{
//get the contents out of the file
var lines = System.IO.File.ReadLines(path);
// split each line into an array of strings
var csv = lines
.Select(line => line.Split(';'))
.ToArray();
//will hold all events
List<Event> events = new List<Event>();
//will hold the numbers of all lines which were OK
List<int> unreadable = new List<int>();
//read each line, if you want to skip header lines, change the zero
for (int lineCounter = 0; lineCounter < csv.Length; lineCounter++)
{
string[] line = csv[lineCounter];
if (line.Length >= 4)
{
string eventName = line[0];
Event currentEvent;
//if we haven't yet created the event, create it now and add it to the dictionary
if (!events.Select(ev => ev.Name).Contains(eventName))
{
currentEvent = new Event { Name = eventName };
//the venues of the new event are still empty
currentEvent.venues = new List<EventInVenue>();
events.Add(currentEvent);
}
else currentEvent = events.Where(ev => ev.Name == eventName).Single();
// the same as above: we have the event now, if the current venue isn't yet on its list, enter it, else use the old one
string venueName = line[1];
EventInVenue currentVenue;
if (!currentEvent.venues.Select(ven => ven.VenueName).Contains(venueName))
{
currentVenue = new EventInVenue { VenueName = venueName };
currentVenue.Dates = new List<EventInstance>();
currentEvent.venues.Add(currentVenue);
}
else currentVenue = currentEvent.venues.Where(ven => ven.VenueName == venueName).Single();
string date = line[2];
string cost = line[3];
EventInstance currentEventInstance = new EventInstance { When = date, Cost = cost };
currentVenue.Dates.Add(currentEventInstance);
}
else
//if the line was too short
unreadable.Add(lineCounter + 1);
}
unreadableLines = unreadable;
return events;
}
}
}
감사합니다. rumtscho. :) 브라우저를 사용하지 않고 JSON을 사용하는 방법을 알면 보안 문제가 해결됩니다. – ElendilTheTall
... – ElendilTheTall
어느 특별히 의미합니까? – ivoszz
Chrome에서는 XMLHttpRequest가 file : /// C : /data.json을로드 할 수 없습니다. Origin null은 Access-Control-Allow-Origin에 의해 허용되지 않습니다. – ElendilTheTall