Efcore: Using Include breaks call to asp.net core api; ERR_SPDY_PROTOCOL_ERROR in Chrome

[januszj]

Issue description

Using ef core "Include" when selecting data inside Api call, data are not sent correctly to browser.
In Chrome it seems that browser is waiting for data: part of json is sent and then it looks like browser is waiting for the rest. So output looks like this, and wheel is spinning on Chrome tab :

[{"courseID":1045,"title":"Calculus","credits":4,"departmentID":3,"department":{"departmentID":3,"name":"Mathematics","budget":100000.0000,"startDate":"2007-09-01T00:00:00","instructorID":10,"rowVersion":"AAAAAAAAF3I=","administrator":null,"courses":[

In Edge nothing is displayed.
When such API is being consumed by Angular I'm receiving net::ERR_SPDY_PROTOCOL_ERROR error in Chrome.

Removing Include from the select solves the problem in executing Api, but of course is not solution when you need to use Eager loading to load related entites.

Steps to reproduce

Using MS sample code:
https://github.com/aspnet/Docs/tree/master/aspnetcore/data/ef-mvc/intro/samples/cu-final

Add to CoursesController following code:

        [HttpGet]
        [Route("bug")]
        public async Task<ICollection<Course>> BugReproduce()
        {
            var courses = _context.Courses
                .Include(c => c.Department);

            return await courses.ToListAsync();
        }

Try to call it with Include in Chrome: http://localhost:7615/bug
It will hang in Chrome and json will not be completely sent to browser.

Try run again with Include removed:

        [HttpGet]
        [Route("bug")]
        public async Task<ICollection<Course>> BugReproduce()
        {
            var courses = _context.Courses;         
            return await courses.ToListAsync();
        }

It should work fine.

Further technical details

EF Core version: 2.0.0
Database Provider: Microsoft.EntityFrameworkCore.SqlServer
Operating system:
Windows 10 x64
IDE: (e.g. Visual Studio 2017.3)

[smitpatel]

This is error in JSON serialization.
Please refer to docs here https://docs.microsoft.com/en-us/ef/core/querying/related-data#related-data-and-serialization

With changes made as suggested in docs, I was able to get the page to load.

[IssamTechs]

either by pass circular reference by using
services.AddMvc().AddJsonOptions(options => { options.SerializerSettings.ReferenceLoopHandling = Newtonsoft.Json.ReferenceLoopHandling.Ignore; });
or make use of view models remove all properties that create the loop referencing

[newtonsheikh]

either by pass circular reference by using
services.AddMvc().AddJsonOptions(options => { options.SerializerSettings.ReferenceLoopHandling = Newtonsoft.Json.ReferenceLoopHandling.Ignore; });
or make use of view models remove all properties that create the loop referencing

Man this helped me fix the circular referece ... wasted 2 weeks now finally done. :) cheers