mvc video cant play large video

Question

i am trying to make project that add video and play it after i am uploading the video and press play it doesn't play the video if the video is more then 4 mb any ideas?

only on chrome browser

@model VideoWeb.Video
@{
ViewBag.Title = "Video";
Layout = "~/Views/_Layout.cshtml";
}

<h2>Video</h2>
@using (Html.BeginForm())
{
 <div id="jp_container_1" class="jp-video " role="application" aria-label="media player">
    <div class="jp-type-single">
        <div id="jquery_jplayer_1" class="jp-jplayer"></div>
        <div class="jp-gui">
            <div class="jp-video-play">
                <button class="jp-video-play-icon" role="button" tabindex="0">play</button>
            </div>
            <div class="jp-interface">
                <div class="jp-progress">
                    <div class="jp-seek-bar">
                        <div class="jp-play-bar"></div>
                    </div>
                </div>
                <div class="jp-current-time" role="timer" aria-label="time">&nbsp;</div>
                <div class="jp-duration" role="timer" aria-label="duration">&nbsp;</div>
                <div class="jp-details">
                    <div class="jp-title" aria-label="title">&nbsp;</div>
                </div>
                <div class="jp-controls-holder">
                    <div class="jp-volume-controls">
                        <button class="jp-mute" role="button" tabindex="0">mute</button>
                        <button class="jp-volume-max" role="button" tabindex="0">max volume</button>
                        <div class="jp-volume-bar">
                            <div class="jp-volume-bar-value"></div>
                        </div>
                    </div>
                    <div class="jp-controls">
                        <button class="jp-play" role="button" tabindex="0">play</button>
                        <button class="jp-stop" role="button" tabindex="0">stop</button>
                    </div>
                    <div class="jp-toggles">
                        <button class="jp-repeat" role="button" tabindex="0">repeat</button>
                        <button class="jp-full-screen" role="button" tabindex="0">full screen</button>
                    </div>
                </div>
            </div>
        </div>
        <div class="jp-no-solution">
            <span>Update Required</span>
            To play the media you will need to either update your browser to a recent version or update your <a href="http://get.adobe.com/flashplayer/" target="_blank">Flash plugin</a>.
        </div>
    </div>
</div>
}

  @using (Html.BeginForm("AddComment", "Home", FormMethod.Post))
{
@*<fieldset class="col-md-1">*@
    <input name="videoId" type="hidden" value="@Model.Id"></input>
    <div class="form-group col-sm-10">
        <label for="name" class="sr-only">Name:</label>
        <input type="text" class="form-control" name="name" id="Name" placeholder="your name" />
    </div>
    <div class="form-group col-sm-10">
        <label for="email" class="sr-only">Email:</label>
        <input type="email" class="form-control" name="email" id="Email" placeholder="email@some.com" /> 
    </div>
    <div class="form-group col-sm-10">
        <label for="message" class="sr-only">Your Comment:</label>
        <textarea type="text" class="form-control" name="message" id="Message" placeholder="some comment on video" ></textarea> 
    </div>
    <div class="form-group col-sm-10">
        <label for="startTime" class="sr-only">startComment:</label>
        <input type="text" class="form-control" name="startTime" id="StartTime" placeholder="starts? mm:ss" />
    </div>
    <div class="form-group col-sm-10">
        <label for="endTime" class="sr-only">Video description:</label>
        <input type="text" class="form-control" name="endTime" id="EndTime" placeholder="ends? mm:ss"/>
    </div>
    <input type="submit" value="AddComment" class="btn btn-default" />
        <br><br>
 @ViewBag.Message
  }

  @using (Html.BeginForm())
  {
if (Model.Comments != null)
{
    foreach (var item in Model.Comments)
    {
        <div class="form-group col-sm-10">
            @Html.DisplayName(item.Name)
        </div>
        <div class="form-group col-sm-10">
            @Html.DisplayName(item.Message)
        </div>
    }
 }
 }
<link type="text/css" rel="stylesheet" href="~/Skin/jplayer.pink.flag.css" />
<script type="text/javascript" src="~/Scripts/jquery-2.2.0.min.js"></script>
<script type="text/javascript" src="~/Scripts/jquery.jplayer.min.js"></script>
<script type="text/javascript">
     $(document).ready(function(){
  $("#jquery_jplayer_1").jPlayer({
    ready: function () {
      $(this).jPlayer("setMedia", {
        title: "@Model.Description",
        m4v: "@Model.Url",
        ogv: "@Model.Url"
      });
    },
    cssSelectorAncestor: "#jp_container_1",
    swfPath: "/js",
    supplied: "m4v, ogv",
    useStateClassSkin: true,
    autoBlur: false,
    smoothPlayBar: true,
    keyEnabled: true,
    remainingDuration: true,
    toggleDuration: true
  });
});

and this is my web config

<?xml version="1.0" encoding="utf-8"?>
<!--
  For more information on how to configure your ASP.NET application, please visit
  http://go.microsoft.com/fwlink/?LinkId=301880
  -->
<configuration>
  <configSections>
    <!-- For more information on Entity Framework configuration, visit http://go.microsoft.com/fwlink/?LinkID=237468 -->
    <section name="entityFramework" type="System.Data.Entity.Internal.ConfigFile.EntityFrameworkSection, EntityFramework, Version=6.0.0.0, Culture=neutral, PublicKeyToken=b77a5c561934e089" requirePermission="false" />
  </configSections>
  <connectionStrings>
    <add name="VideoWebConnectionString" connectionString="Data Source=(LocalDB)\MSSQLLocalDB;AttachDbFilename=C:\Users\New\Documents\visual studio 2015\Projects\VideoWeb\VideoWeb\App_Data\VideoWeb.mdf;Integrated Security=True" providerName="System.Data.SqlClient" />
    <add name="videoWebEntities" connectionString="metadata=res://*/Models.Model1.csdl|res://*/Models.Model1.ssdl|res://*/Models.Model1.msl;provider=System.Data.SqlClient;provider connection string=&quot;data source=NEW-PC;initial catalog=videoWeb;integrated security=True;MultipleActiveResultSets=True;App=EntityFramework&quot;" providerName="System.Data.EntityClient" />
    <add name="vid" connectionString="data source=NEW-PC;initial catalog=videoWeb;integrated security=True;MultipleActiveResultSets=True;App=EntityFramework" providerName="System.Data.SqlClient" />
    <add name="VideoWebConnectionString1" connectionString="Data Source=orenlap;Initial Catalog=VideoWeb;Integrated Security=True;Pooling=False" providerName="System.Data.SqlClient" />
  </connectionStrings>
  <appSettings>
    <add key="webpages:Version" value="3.0.0.0" />
    <add key="webpages:Enabled" value="false" />
    <add key="ClientValidationEnabled" value="true" />
    <add key="UnobtrusiveJavaScriptEnabled" value="true" />
  </appSettings>
  <system.web>
    <compilation debug="true" targetFramework="4.5.2" />
    <httpRuntime targetFramework="4.5.2" maxRequestLength="1048576" />
    <httpModules>
      <add name="ApplicationInsightsWebTracking" type="Microsoft.ApplicationInsights.Web.ApplicationInsightsHttpModule, Microsoft.AI.Web" />
    </httpModules>
  </system.web>
  <runtime>
    <assemblyBinding xmlns="urn:schemas-microsoft-com:asm.v1">
      <dependentAssembly>
        <assemblyIdentity name="System.Web.Helpers" publicKeyToken="31bf3856ad364e35" />
        <bindingRedirect oldVersion="1.0.0.0-3.0.0.0" newVersion="3.0.0.0" />
      </dependentAssembly>
      <dependentAssembly>
        <assemblyIdentity name="System.Web.WebPages" publicKeyToken="31bf3856ad364e35" />
        <bindingRedirect oldVersion="1.0.0.0-3.0.0.0" newVersion="3.0.0.0" />
      </dependentAssembly>
      <dependentAssembly>
        <assemblyIdentity name="System.Web.Mvc" publicKeyToken="31bf3856ad364e35" />
        <bindingRedirect oldVersion="0.0.0.0-5.2.3.0" newVersion="5.2.3.0" />
      </dependentAssembly>
      <dependentAssembly>
        <assemblyIdentity name="WebGrease" publicKeyToken="31bf3856ad364e35" culture="neutral" />
        <bindingRedirect oldVersion="0.0.0.0-1.5.2.14234" newVersion="1.5.2.14234" />
      </dependentAssembly>
    </assemblyBinding>
  </runtime>
  <system.codedom>
    <compilers>
      <compiler language="c#;cs;csharp" extension=".cs" type="Microsoft.CodeDom.Providers.DotNetCompilerPlatform.CSharpCodeProvider, Microsoft.CodeDom.Providers.DotNetCompilerPlatform, Version=1.0.0.0, Culture=neutral, PublicKeyToken=31bf3856ad364e35" warningLevel="4" compilerOptions="/langversion:6 /nowarn:1659;1699;1701" />
      <compiler language="vb;vbs;visualbasic;vbscript" extension=".vb" type="Microsoft.CodeDom.Providers.DotNetCompilerPlatform.VBCodeProvider, Microsoft.CodeDom.Providers.DotNetCompilerPlatform, Version=1.0.0.0, Culture=neutral, PublicKeyToken=31bf3856ad364e35" warningLevel="4" compilerOptions="/langversion:14 /nowarn:41008 /define:_MYTYPE=\&quot;Web\&quot; /optionInfer+" />
    </compilers>
  </system.codedom>
  <system.webServer>
    <validation validateIntegratedModeConfiguration="false" />
    <modules>
      <remove name="ApplicationInsightsWebTracking" />
      <add name="ApplicationInsightsWebTracking" type="Microsoft.ApplicationInsights.Web.ApplicationInsightsHttpModule, Microsoft.AI.Web" preCondition="managedHandler" />
    </modules>
    <security>
      <requestFiltering>
         <requestLimits maxAllowedContentLength="1073741824" />
      </requestFiltering>
   </security>
  </system.webServer>
  <entityFramework>
    <defaultConnectionFactory type="System.Data.Entity.Infrastructure.LocalDbConnectionFactory, EntityFramework">
      <parameters>
        <parameter value="mssqllocaldb" />
      </parameters>
    </defaultConnectionFactory>
    <providers>
      <provider invariantName="System.Data.SqlClient" type="System.Data.Entity.SqlServer.SqlProviderServices, EntityFramework.SqlServer" />
    </providers>
  </entityFramework>
</configuration>

there is no error or exeption just doesnt play large video more then 4 mb but i can upload large video if you will ne other code i will provide but i dont think is needed and if you have other suggested of playing upload video (with more formats) i please let me know

score 1 · Answer 1 · edited May 23 '17 at 12:22

I think you are overloading the browsers cache. You should go for chunky datastream which is being saved serverside in some file (if you wanna save it) and the local cookie. When you send pack of data - delete it as soon as you can to free the browser memory to load next chunk.

Hope it will fix your issue.

How to free it for chrome?

For example, if I wanna do it via ajax: (jQuery Ajax File Upload)

freeing this memory is just replacing it with new chunk (free&load) or delete this and load next chunk in another variable.

I am requesting the file upload session via POST request
I am receiving for example "iqfajifjioqejiofji", so I am saving as (var) session_id
I am loading 128 kB of data, and I am sending it in (find better way) POST request with additional data (this sessionid).
Server is receiving these data, responding, while received respond, delete your chunk, load next and loop it till you send all the data.

Feel free to comment to ask anything. You should go for WebRTC or WebSocket to make it robust, fast and efficient. The session_id is for basic support of many incoming videos.

mvc video cant play large video

1 Answers1