Почему этот Plnkr не работает, когда я его загружаю?

Я новичок в Angular.js и экспериментировал с ним на Plnkr здесь http://plnkr.co/edit/jR9VfaEhjUfY0vN7mfWd

Предварительный просмотр Plnkr показывает, что вкладки и фрагменты загружаются нормально, но когда я загружаю его на свой компьютер, работают только вкладки, почему не отображаются фрагменты? Надеюсь, этот скриншот объясняет мое затруднительное положение:

введите здесь описание изображения

Спасибо


javascript angularjs plunker
person Jonathan    schedule 11.10.2013    source источник
comment
Что говорит консоль вашего браузера?   -  person Zack Argyle    schedule 12.10.2013
comment
Вам нужно запустить его на веб-сервере (localhost), иначе вы получите эту ошибку: Failed to load resource: Origin null is not allowed by Access-Control-Allow-Origin. Нажмите F12 в Chrome, чтобы получить консоль отладки.   -  person jpmorin    schedule 12.10.2013
comment
Никогда не думал проверять консоль, я новичок в Javascript в целом. Только что проверил консоль и получил упомянутую ошибку jpmorin. Запуск на веб-сервере работает. Спасибо!   -  person Jonathan    schedule 12.10.2013
comment
@jpmorin, вы хотите поставить это как ответ, чтобы я мог закрыть этот вопрос?   -  person Jonathan    schedule 12.10.2013

Ответы (1)


arrow_upward
2
arrow_downward

Вам нужно получить страницу с помощью веб-сервера, чтобы не было нарушения «Access-Control-Allow-Origin». Когда скрипт из example1.com пытается сделать запрос AJAX на example2.com, браузеры сначала проверяют, разрешает ли example2.com доступ с другого веб-сайта. Это делается путем чтения Access-Control-Allow-Origin заголовка example2.com. Большинство веб-сайтов обычно не разрешают доступ AJAX.

В вашем случае источником является file:///..., который не будет устанавливать заголовок Access-Control-Allow-Origin, и, поскольку по умолчанию запрос блокируется, вы получаете сообщение об ошибке.

Чтобы обойти это, сделайте следующее (убедитесь, что у вас установлен ruby ​​или python):

  1. Открыть командную строку
  2. Используйте команду cd для переключения в каталог вашего проекта (учебное пособие)

  3. Введите любую из команд

    python -m SimpleHTTPServer for python

    or

    ruby -run -e httpd -- -p 8000 . for ruby.

Это запустит базовый HTTP-сервер на порту 8000. HTTP-сервер разрешит доступ к файлам в каталоге, из которого вы запустили команду. Итак, если у вас есть, например, index.html в каталоге, вы можете сделать http://localhost:8000/index.html

Глядя на скриншот, вы можете сделать это -

  1. Открыть командную строку

  2. бежать

    cd C:/Users/Jonny/Desktop/plunker

  3. запустить сервер

    python -m SimpleHTTPServer
  4. Откройте http://localhost:8000/index.html#/invoices в браузере.
person Apoorv Parijat    schedule 11.10.2013
comment
У меня не установлен Python, я использую xampp, но вы ответили на вопрос в первом абзаце, так что можете оставить его на этом :) - person Jonathan; 12.10.2013
comment
Большой. Старый добрый xampp должен подойти. :D - person Apoorv Parijat; 12.10.2013