Нажатие на ссылку в HTML не дает ответа - PullRequest
Новая
       9

Нажатие на ссылку в HTML не дает ответа

1 голос
/ 07 апреля 2019

Последние 2 недели я пытался заставить это работать, но, похоже, не могу найти проблему.когда я нажимаю на пользователя, чтобы поговорить с ним, создается впечатление, что между ними не создается чат.Я следовал этому руководству https://pusher.com/tutorials/chat-aspnet/, но отредактировал несколько вещей, таких как моя база данных.После отладки кажется, что ничего не происходит, когда я нажимаю на одну из ссылок пользователя.

Я попытался переименовать все и начать все заново

Мой вид с использованием JavaScript: 

<div class="container">
    <div class="row">
        <div class="col-xs-12 col-md-3">
            <aside class="main visible-md visible-lg">
                <div class="row">
                    <div class="col-xs-12">
                        <div class="panel panel-default users__bar">
                            <div class="panel-heading users__heading">
                                Contacts (@ViewBag.allUsers.Count)
                            </div>
                            <div class="__no__chat__">
                                <p>Select a contact to chat with</p>
                            </div>
                            <div class="panel-body users__body">
                                <ul id="contacts" class="list-group">

                                    @foreach (var user in @ViewBag.allUsers)
                                    {
                                        <a class="user__item contact-@user.Id" href="#" data-contact-id="@user.Id" data-contact-name="@user.FirstName">
                                            <li>
                                                <div class="avatar">
                                                    <img src="@Url.Content("~/Content/no_avatar.png")">
                                                </div>
                                                <span>@user.FirstName</span>
                                                <div class="status-bar"></div>
                                            </li>
                                        </a>
                                    }
                                </ul>
                            </div>
                        </div>
                    </div>
                </div>
            </aside>


        </div>
        <div class="col-xs-12 col-md-9 chat__body">
            <div class="row">
                <div class="col-xs-12">
                    <ul class="list-group chat__main"></ul>
                </div>
                <div class="chat__type__body">
                    <div class="chat__type">
                        <textarea id="msg_box" placeholder="Type your message"></textarea>
                        <button class="btn btn-primary" id="sendMessage">Send</button>
                    </div>
                </div>
                <div class="chat__typing">
                    <span id="typerDisplay"></span>
                </div>
            </div>
        </div>
    </div>
</div>
<script>
    let currentContact = null; // Holds current contact
    let newMessageTpl =
        `<div>
        <div id="msg-{{id}}" class="row __chat__par__">
          <div class="__chat__">
            <p>{{body}}</p>
            <p class="delivery-status">Delivered</p>
          </div>
        </div>
     </div>`;

    // select contact to chat with
    $('.user__item').click(function(e) {
        e.preventDefault();

        currentContact = {
            Id: $(this).data('contact-id'),
            FirstName: $(this).data('contact-name'),
        };

        $('#contacts').find('li').removeClass('active');

        $('#contacts .contact-' + currentContact.Id).find('li').addClass('active');
        getChat(currentContact.Id);
    });

    // get chat data
    function getChat(contact_id) {
        $.get("/contact/conversations/" + contact_id)
            .done(function(resp) {
                var chat_data = resp.data || [];
                loadChat(chat_data);
            });
    }

   ...

Мой контроллер: 

public ActionResult Index()
        {
            if (Session["UserID"] == null)
            {
                return Redirect("/");
            }

            //var currentUser = (Models.tblUser) Session["UserID"];


            using (var db = new Models.ChatContext())
            {
                int currentUserId = (int) Session["UserID"];
                var currentUser = db.Users.FirstOrDefault(x => x.Id == currentUserId);
                ViewBag.allUsers = db.Users.Where(u => u.Id != currentUser.Id).ToList();
                ViewBag.currentUser = currentUser;
            }


            return View();
        }

        public JsonResult ConversationWithContact(int contact)
        {
            if (Session["UserID"] == null)
            {
                return Json(new {status = "error", message = "User is not logged in"});
            }

            var currentUser = (Models.tblUser)Session["UserID"];

            var conversations = new List<Models.tblMessage>();

            using (var db = new Models.ChatContext())
            {
                conversations = db.Conversations.Where(c => (c.receiverId == currentUser.Id
                                                             && c.senderId == contact) ||
                                                            (c.receiverId == contact
                                                             && c.senderId == currentUser.Id))
                    .OrderBy(c => c.created_at)
                    .ToList();
            }

            return Json(
                new {status = "success", data = conversations},
                JsonRequestBehavior.AllowGet
            );
        }

Модель моего сообщения и чат-текст: 

public class ChatContext : DbContext
    {
        public ChatContext() : base("TrinityEntities")
        {
        }

        public static ChatContext Create()
        {
            return new ChatContext();
        }

        public DbSet<tblUser> Users { get; set; }
        public DbSet<tblMessage> Conversations { get; set; }
    }

public class tblMessage
    {
        public tblMessage()
        {
            status = messageStatus.Sent;
        }

        public enum messageStatus
        {
            Sent,
            Delivered
        }

        public int Id { get; set; }
        public int senderId { get; set; }
        public int receiverId { get; set; }
        public string message { get; set; }
        public messageStatus status { get; set; }
        public System.DateTime created_at { get; set; }
    }

Мой маршрут-конфигурации: 

routes.IgnoreRoute("{resource}.axd/{*pathInfo}");

            routes.MapRoute(
                name: "Default",
                url: "{controller}/{action}/{id}",
                defaults: new { controller = "Auth", action = "Index", id = UrlParameter.Optional }
            );

            //routes.MapRoute(
            //    name: "Default",
            //    url: "",
            //    defaults: new { controller = "Auth", action = "Index", id = UrlParameter.Optional }
            //);

            routes.MapRoute(
                name: "Profile",
                url: "profile",
                defaults: new { controller = "Profile", action = "Index" }
            );

            routes.MapRoute(
                name: "Home",
                url: "Home",
                defaults: new { controller = "Home", action = "Index" }
            );

            routes.MapRoute(
                name: "ChatRoom",
                url: "chat",
                defaults: new { controller = "Chat", action = "Index" }
            );

            routes.MapRoute(
                name: "GetContactConversations",
                url: "contact/conversations/{contact}",
                defaults: new { controller = "Chat", action = "ConversationWithContact", contact = "" }
            );

            routes.MapRoute(
                name: "PusherAuth",
                url: "pusher/auth",
                defaults: new { controller = "Auth", action = "AuthForChannel" }
            );

            routes.MapRoute(
                name: "SendMessage",
                url: "send_message",
                defaults: new { controller = "Chat", action = "SendMessage" }
            );

            routes.MapRoute(
                name: "MessageDelivered",
                url: "message_delivered/{message_id}",
                defaults: new { controller = "Chat", action = "MessageDelivered", message_id = "" }
            );

1 Ответ

1 голос
/ 07 апреля 2019

Существует строка, которую вы, возможно, пропустили в инструкциях чуть ниже бита ChatContext:

"Чтобы получить сообщения, мы создадим маршрут для / contact`` / разговор / {contact}. Этот маршрут будет принимать идентификатор контакта, получать сообщения между текущим пользователем и контактом, а затем возвращать сообщения в ответе JSON. "

В настоящее время в javascript функция getChat ()отправляет запрос на /contact/conversation/{contactId}.Для проектов MVC формат маршрута по умолчанию - /{controllerName}/{actionName}/{parameter}.Таким образом, вызов в вашем javascript в настоящее время ищет контроллер с именем ContactController, а затем действие на этом контроллере с именем Conversation.Как вы знаете, в настоящее время они не существуют в вашем проекте, поэтому вам нужно настроить маршрут в routeConfig, который распознает входящий запрос и направит его туда, куда вы хотите вместо этого: 

routes.MapRoute(
                name: "ChatRoom",
                url: "chat/conversation/{contact}",
                defaults: new { controller = "Chat", action = "ConversationWithContact" }
            );

Это должно решить вашу проблему.Тем не менее, поскольку вы только учитесь, я думаю, что стоит упомянуть, что, хотя это хорошо для небольшого приложения, ручное отображение маршрутов, подобных этому, может привести к путанице, когда приложение растет, поскольку вы можете иметь десятки маршрутов с разными именами, указывающими на контроллеры и действия, которые вы выполняете.не смог бы угадать.Проще поддерживать и понимать, как работает код, если он соответствует какому-то стандарту, например /controllerName/actionName

...