本文介绍了Ember 3.2.2无法将请求路由到.NET Core 2.1 JSON Web API的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我对使用Ember并不陌生,并且一直在关注在线视频教程(请参见下面的网络链接,尽管它使用.NET Core 1.0注明了日期),该教程演示了如何使用Ember前端设置JSON API后端-我正在使用Visual Studio Code.我已经成功完成了第一个视频,并从JSON API后端收到了响应.但是,我无法通过让Ember向api后端发送请求进行数据检索来使第二个视频正常工作.我知道这是因为我正在监视对服务器的调用.因此,虽然我可以访问后端服务器并接收JSON响应,但前端响应是HTTP错误404-找不到页面,也没有对后端的请求.

I am new to using Ember and have been following an online video tutorial (see weblink below, though its dated as it uses .NET Core 1.0) that demonstrates how to setup a JSON API back-end with an Ember front-end - I am using Visual Studio Code. I have successfully completed the first video and receive responses from the JSON API back-end. However, I am unable to get the second video working by having Ember send a request to the api-back end for data retrieval. I know this because I am monitoring the calls to the server. So, while I can hit the back-end server and receive a JSON response, the front-end response is HTTP Error 404 - page not found and there is no request to the back-end.

HTTP错误:

Error: Ember Data Request GET /todo-items returned a 404
Payload (text/html; charset=utf-8)
<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="utf-8">
        <title>Error</title>
    </head>
    <body>
        <pre>Cannot GET /todo-items</pre>
    </body>
</html>

我最好的猜测是,.NET Core和Ember在路由方面进行了更改,这些更改未在视频中进行介绍.不幸的是,几乎不会发生404错误,我无法找到问题.有人知道问题出在哪里或如何解决吗?

My best guess is that changes have been made to .NET Core and Ember with respect to routing that are not covered in the videos. Unfortunately, a 404 error is very little to go on and I am unable to find the problem. Does anybody know where the problem is or how I can troubleshoot this?

视频教程:> ://www.youtube.com/watch?v = _d53rG2i9pY& index = 2& list = PLu4Bq53iqJJAo1RF0TY4Q5qCG7n9AqSZf

router.js

import EmberRouter from '@ember/routing/router';
import config from './config/environment';

const Router = EmberRouter.extend({
  location: config.locationType,
  rootURL: config.rootURL
});

Router.map(function() {
  this.route('todo-items');
});

export default Router;

environment.js

'use strict';

module.exports = function(environment) {
  let ENV = {
    modulePrefix: 'todo-list-client',
    environment,
    rootURL: '/',
    locationType: 'auto',
    EmberENV: {
      FEATURES: {
        // Here you can enable experimental features on an ember canary build
        // e.g. 'with-controller': true
      },
      EXTEND_PROTOTYPES: {
        // Prevent Ember Data from overriding Date.parse.
        Date: false
      }
    },

    APP: {
      host: 'http://localhost:5000',
      namespace: 'api/v1'
    }
  };

  if (environment === 'development') {
    // ENV.APP.LOG_RESOLVER = true;
    // ENV.APP.LOG_ACTIVE_GENERATION = true;
    // ENV.APP.LOG_TRANSITIONS = true;
    // ENV.APP.LOG_TRANSITIONS_INTERNAL = true;
    // ENV.APP.LOG_VIEW_LOOKUPS = true;
  }

  if (environment === 'test') {
    // Testem prefers this...
    ENV.locationType = 'none';

    // keep test console output quieter
    ENV.APP.LOG_ACTIVE_GENERATION = false;
    ENV.APP.LOG_VIEW_LOOKUPS = false;

    ENV.APP.rootElement = '#ember-testing';
    ENV.APP.autoboot = false;
  }

  if (environment === 'production') {
    // here you can enable a production-specific feature
  }

  return ENV;
};

application.js

import DS from 'ember-data';
import ENV from './config/environment';

export default DS.JSONAPIAdapter.extend({
    namespace: ENV.APP.namespace,
    host: ENV.APP.host
})

todo-items.js

import Route from '@ember/routing/route';

export default Route.extend({
    model(){
        return this.store.findAll('todo-item');
    }
});

模型文件:

todo-item.js

import DS from 'ember-data';

const { attr, belongsTo} = DS;

export default DS.Model.extend({
    description: attr('string'),
    owner: belongsTo('person')
});

person.js

import DS from 'ember-data';

const { attr, hasMany} = DS;

export default DS.Model.extend({
    firstName: attr('string'),
    lastName: attr('string'),
    todoItems: hasMany('todo-item')
});

更新1:

API服务器在端口5000上运行,而Ember在4200上运行.

API server is running on port 5000 while Ember is running on 4200.

  • API URL call: http://localhost:5000/api/v1/people
  • Ember URL call: http://localhost:4200/todo-items

更新2

服务器消息:

  • API: Now listening on: http://localhost:5000
  • Ember: Serving on http://localhost:4200/

推荐答案

我发现了问题.我需要设置CORS.

I found the problem. I needed to setup CORS.

这篇关于Ember 3.2.2无法将请求路由到.NET Core 2.1 JSON Web API的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持!

10-11 13:11